<template>
    <div>
        <h1>表单测试</h1>
        <table style="border:1px solid #f00;width:400px">
            <tr v-for="(item,index) in formList.metaList"
            :key="item.key"
            >
                <td>
                    {{item.key}}
                </td>
                <td>
                    <span v-if="!item.isDetail">{{formList.metaList[index].value}}</span>
                    <el-input
                    v-else
                    v-model="formList.metaList[index].value"
                    ></el-input>
                </td>
            </tr>
        </table>
        <el-button @click="edit">编辑</el-button>
        <el-button @click="getValue">获取值</el-button>
    </div>
</template>
<script>
export default {
    props:{
        formList:{
            type:Object,
            require:true,
            default:()=>{
                return { metaList: [
                    
                ]}
            }
                
            }
    },
    
    methods:{
        edit(){
            this.formList.metaList.forEach((item)=>{
                item.isDetail = !item.isDetail
            })
        },
        getValue(){
            console.log(this.formList)
        }
    }
}

</script>
